$(window).on("load", function () {
     var oCol = document.querySelector('.col');
     var oCont = document.querySelector(".cont");
     var oTab = document.querySelector(".tab")

     //1.把第一张图片克隆 到最后一张
     let cloneLi = oCont.children[0].cloneNode(true);
     oCont.appendChild(cloneLi);
     //3.自动轮播
     var imgIndex = 0;
     var pointIndex = 0;
     const autoPlay = () => {
          // console.log(imgIndex);
          imgIndex++;
          if (imgIndex == 6) {
               imgIndex = 1;
               //位置是0开始
               oCont.style.left = "0px";
          }
          $$.animate(oCont, { left: -imgIndex * 2000 });
          //下边的点,也要跟着动起来
          pointIndex++;
          if (pointIndex == 5) {
               pointIndex = 0;
          }
          //先把所有的 黄色点,都清除掉
          Array.from(oTab.children).forEach(el => el.className = "tab-item J-tab-trigger");
          oTab.children[pointIndex].className = "current tab-item J-tab-trigger" ;
     }
     //执行自动轮播
     let timer = setInterval(autoPlay, 3000);
     // 4.鼠标进入 暂停
     //不要在多次循环里,使用addEventListener
     oCol.addEventListener("mouseenter", function () {
          clearInterval(timer);
     })
     // 5.鼠标离开,开启
     oCol.addEventListener("mouseleave", function () {
          timer = setInterval(autoPlay, 3000);
     })
     
     Array.from(oTab.children).forEach((el, index) => {
          el.addEventListener("click", function () {
               //三国统一
               pointIndex = imgIndex = index - 1;
               autoPlay(); //这里 会有 ++
          })
     });

    })